// import Vuex from 'vuex'
// Vuex.use(Vuex)
import { createStore } from 'vuex'
import moduleA from './moduleA'
// import persist from 'vuex-persist'
// npm/cnpm install vuex-persistedstate --save 
// yarn add vuex-persistedstate --save
import persist from 'vuex-persistedstate'
export default createStore({
  state: { // 存储状态的方法 
    tasks: [],
    num: 0
  },
  getters: {
    // 相当于vue中的computed 计算属性 得到的结果可以缓存
    // 正在进行中的任务数量
    countWorking(state) {
      let num = 0
      state.tasks.forEach(item => {
        if(!item.check) num++
      })
      return num
    },

    // 已经完成的任务数量
    countFinish(state) {
      let num = 0
      state.tasks.forEach(item => {
        if(item.check) num++
      })
      return num
    },
  },
  mutations: {
    // vuex中 修改state数据的唯一方法就是提交mutation
    addTask(state, value) {
      let obj = {
        id: new Date().getTime(),
        content: value,
        check: false,
        isExit: false
      }
      state.tasks.push(obj)
    },
    // 删除任务
    delTask(state, i) {
      state.tasks.splice(i, 1)
    },

    // 显示编辑功能的过程
    changeExit(state, i) {
      state.tasks[i].isExit = true
    },

    // 关闭编辑功能的逻辑
    closeExit(state, i) {
      state.tasks[i].isExit = false
    },
  },
  actions: {

  },
  modules: {
    // 模块化的方法
    moduleA
  },

  plugins: [
    persist(
      {
        // storage: sessionStorage,
        reducer(state) {
          return {
            tasks: state.tasks,
            num: state.num
          }
        }
      }
    )
  ]
})
